<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <title>CSS Test: anonymous table cell and white space separating inline elements</title>
  <link rel="author" title="Boris Zbarsky" href="mailto:bzbarsky@mit.edu" />
  <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
  <link rel="help" href="http://www.w3.org/TR/CSS21/tables.html#anonymous-boxes" title="17.2.1 Anonymous table objects" />
  <link rel="bookmark" href="http://lists.w3.org/Archives/Public/public-css-testsuite/2013Aug/0028.html" title="Browser non-interop on basic anonymous table boxes" />
  <meta name="flags" content="" />
  <meta name="assert" content="Anonymous table objects are automatically generated by UAs when a table element is missing necessary sub-table elements (like table-row or table-cell). In this test, an anonymous table-row and one anonymous table-cell will be created around the inline elements. This test checks that each white space separating the 3 span elements are preserved." />

  <style type="text/css"><![CDATA[
  div#rel-pos-wrapper
  {
  font-size: 2em;
  position: relative;
  }

  div#test-overlapping-green
  {
  color: green;
  display: table;
  position: absolute;
  top: 0;
  z-index: 2;
  }
  
  div#reference-overlapped-red
  {
  color: red;
  position: relative;
  z-index: 1;
  }
  ]]></style>

  </head>

 <body>

  <p>There should be no red below, except for antialiasing issues.</p>

  <div id="rel-pos-wrapper">

    <div id="test-overlapping-green">
    <span>a</span> <span>bc</span> <span>d</span>
    </div>

    <div id="reference-overlapped-red">
    a bc d
    </div>

  </div>

 </body>
</html>